<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/layui/jquery-3.5.1.min.js"></script>
    <link rel="stylesheet" href="/layui/css/layui.css"  media="all">
    <script src="/layui/layui.js" charset="utf-8"></script>
</head>
<body>
<form class="layui-form" action="" lay-filter="example">
    <div class="layui-form-item">
        <label class="layui-form-label">工作标题</label>
        <div class="layui-input-block">
            <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">优先级</label>
        <div class="layui-input-block">
            <input type="text" name="priority" lay-verify="num" autocomplete="off" placeholder="输入数字" class="layui-input">
        </div>
    </div>
            <input type="hidden" name="sid" th:value="${param.sid}">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">开始日期</label>
            <div class="layui-input-inline">
                <input type="text" name="startTime" id="date" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">结束日期</label>
            <div class="layui-input-block">
                <input type="text" name="endTime" id="date1" autocomplete="off" class="layui-input" placeholder="yyyy-MM-dd" lay-verify="confirmData">
            </div>
        </div>
    </div>


    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">工作内容</label>
        <div class="layui-input-block">
            <textarea placeholder="请输入内容" class="layui-textarea" name="work"></textarea>
        </div>
    </div>
    <!--<div class="layui-form-item layui-form-text">
      <label class="layui-form-label">编辑器</label>
      <div class="layui-input-block">
        <textarea class="layui-textarea layui-hide" name="content" lay-verify="content" id="LAY_demo_editor"></textarea>
      </div>
    </div>-->
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即制定</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            <button type="button" class="layui-btn layui-btn-normal" id="back">返回计划页</button>
        </div>
    </div>
</form>




<script th:inline="javascript">
    var date =[[${param.date}]];

    layui.use(['form', 'jquery','layedit', 'laydate'], function(){
        var form = layui.form
            ,$  =layui.jquery
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '#date',
            min : getNowFormatDate()

        });
        laydate.render({
            elem: '#date1'
        });

        //赋值
        $(function () {
            form.val('example', {
                "priority": 1
            });
        })



        //自定义验证规则
        form.verify({
            title: function(value){
                if(value.length < 2){
                    return '标题至少得2个字符啊';
                }
            }
            ,num: [
                /^[\d]{1,2}$/
                ,'优先级最多两位数字'
            ]
            ,content: function(value){
                layedit.sync(editIndex);
            }
            , confirmData:function(value){
                var startDate = new Date($('#date').val()).getTime();
                var endTime = new Date(value).getTime();
                if(endTime < startDate) {
                    return '结束时间不能小于开始时间';
                }
            }
        });

        //监听提交
        form.on('submit(demo1)', function(data){
            // layer.alert(JSON.stringify(data.field), {
            // })
            // return false;
            var data =data.field;

            var work= data.work;
            var title =data.title;
            var priority =data.priority;
            var startTime =data.startTime;
            var endTime =data.endTime;
            var sid= data.sid;

            $.ajax({
                url:"/dailyplan/getdata",
                data:{sid:sid,work:work,title:title,priority:priority,startTime:startTime,endTime:endTime},
                success: function () {

                    location.href="/dailyplan/calendar"
                }
            })
            return false;
        });
        //赋值
        $(function () {
            if(date.toString()!="null"||date.toString()!=null){
                form.val('example', {
                    "startTime": date.toString() // "name": "value"
                });
            }
        })

    });

        $(function () {
            $("#back").click(function () {
                location.href="/dailyplan/calendar";
            })
        })

    function getNowFormatDate() {
        var date = new Date();
        var seperator1 = "-";
        var seperator2 = ":";
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
            month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
            strDate = "0" + strDate;
        }
        var currentdate = date.getFullYear() + seperator1 + month
            + seperator1 + strDate + " " + date.getHours() + seperator2
            + date.getMinutes() + seperator2 + date.getSeconds();
        return currentdate;
    }
</script>
</body>
</html>